﻿<common:LayoutAwarePage
    x:Class="SuperQuiz.View.QuizResultsControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:SuperQuiz.View"
    xmlns:common="using:SuperQuiz.Common"
    xmlns:utils="using:SuperQuiz.Utils"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300"
    d:DesignWidth="400">
    <Page.Resources>
        <utils:AlternateBackgroundConverter x:Key="AlternateBackgroundConverter" />
        <utils:StringIsNullOrEmptyToVisibilityConverter x:Key="StringIsNullOrEmptyToVisibilityConverter"/>
        <common:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
        <utils:ValueConverterGroup x:Key="InvertedBooleanToVisibilityConverter">
            <common:BooleanNegationConverter />
            <common:BooleanToVisibilityConverter />
        </utils:ValueConverterGroup>
    </Page.Resources>
    <Grid>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*" />
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>
            <Grid x:Name="resultListHeaderGrid" Style="{StaticResource ResultsListGridStyle}">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <TextBlock Text="Question" x:Uid="QuestionTitleTextBlock" x:Name="questionListHeader" Grid.Column="0" Style="{StaticResource ResultsListHeaderTextStyle}" />
                <TextBlock Text="Correct answer" x:Uid="CorrectAnswerTitleTextBlock" x:Name="correctAnswerListHeader" Grid.Column="1"  Style="{StaticResource ResultsListHeaderTextStyle}" Visibility="{Binding Quiz.ShowCorrectAnswerOnFinish, Converter={StaticResource BooleanToVisibilityConverter}}" />
                <TextBlock Text="Your answer" x:Uid="YourAnswerTitleTextBlock" x:Name="selectedAnswerListHeader" Grid.Column="2"  Style="{StaticResource ResultsListHeaderTextStyle}" />
                <TextBlock Text="Points" x:Uid="PointsTitleTextBlock" HorizontalAlignment="Center" x:Name="pointsListHeader" Grid.Column="3"  Style="{StaticResource ResultsListHeaderTextStyle}" />
            </Grid>
            <ListView ItemsSource="{Binding Items}" Grid.Row="1" HorizontalContentAlignment="Stretch" HorizontalAlignment="Stretch" SelectionMode="None" x:Name="listResults">
                <ListView.ItemContainerStyle>
                    <Style TargetType="ListViewItem">
                        <Setter Property="HorizontalContentAlignment" Value="Stretch"></Setter>
                        <Setter Property="HorizontalAlignment" Value="Stretch"></Setter>
                        <Setter Property="Margin" Value="0"></Setter>
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="ListViewItem">
                                    <Grid>
                                        <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                                    </Grid>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </ListView.ItemContainerStyle>
                <ListView.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel HorizontalAlignment="Stretch"/>
                    </ItemsPanelTemplate>
                </ListView.ItemsPanel>
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <UserControl Loaded="StartLayoutUpdates" Unloaded="StopLayoutUpdates">
                            <Grid x:Name="resultListItemGrid" Style="{StaticResource ResultsListGridStyle}" Background="{Binding AlternateItem, Converter={StaticResource AlternateBackgroundConverter}}" VerticalAlignment="Center">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="*" x:Name="columnCorrectAnswers"/>
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="*" />
                                </Grid.ColumnDefinitions>
                                <StackPanel Grid.Column="0">
                                    <TextBlock x:Name="questionTitleListItem" Text="{Binding Question.Title}" Style="{StaticResource ResultsListItemTextStyle}" />
                                    <TextBlock x:Name="questionSubTitleListItem" Text="{Binding Question.SubTitle}" Visibility="{Binding  Question.SubTitle, Converter={StaticResource StringIsNullOrEmptyToVisibilityConverter}}" Style="{StaticResource ResultsListItemTextStyle}" />
                                </StackPanel>
                                <TextBlock x:Name="correctAnswerListItem" Text="{Binding MostCorrectAnswer.Name}" Grid.Column="1"  Style="{StaticResource ResultsListItemTextStyle}" />
                                <TextBlock x:Name="selectedAnswerListItem" Text="{Binding SelectedAnswer.Name}" Grid.Column="2"  Style="{StaticResource ResultsListItemTextStyle}" />
                                <TextBlock x:Name="pointsListItem" HorizontalAlignment="Center" Text="{Binding SelectedAnswer.Points}" Grid.Column="3"  Style="{StaticResource ResultsListItemTextStyle}" />
                                <VisualStateManager.VisualStateGroups>
                                    <VisualStateGroup x:Name="ApplicationViewStates">
                                        <VisualState x:Name="FullScreenLandscape"/>
                                        <VisualState x:Name="Filled"/>

                                        <!-- Respect the narrower 100-pixel margin convention for portrait -->
                                        <VisualState x:Name="FullScreenPortrait">
                                        </VisualState>

                                        <!-- When snapped, the content is reformatted and scrolls vertically -->
                                        <VisualState x:Name="Snapped">
                                            <Storyboard>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="resultListItemGrid" Storyboard.TargetProperty="Style">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ResultsListGridStyleSnapped}"/>
                                                </ObjectAnimationUsingKeyFrames>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="questionTitleListItem" Storyboard.TargetProperty="Style">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ResultsListItemTextStyleSnapped}"/>
                                                </ObjectAnimationUsingKeyFrames>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="questionSubTitleListItem" Storyboard.TargetProperty="Style">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ResultsListItemTextStyleSnapped}"/>
                                                </ObjectAnimationUsingKeyFrames>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="correctAnswerListItem" Storyboard.TargetProperty="Style">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ResultsListItemTextStyleSnapped}"/>
                                                </ObjectAnimationUsingKeyFrames>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="selectedAnswerListItem" Storyboard.TargetProperty="Style">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ResultsListItemTextStyleSnapped}"/>
                                                </ObjectAnimationUsingKeyFrames>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="pointsListItem" Storyboard.TargetProperty="Style">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ResultsListItemTextStyleSnapped}"/>
                                                </ObjectAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </VisualState>
                                    </VisualStateGroup>
                                </VisualStateManager.VisualStateGroups>
                            </Grid>
                        </UserControl>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
            <StackPanel Orientation="Horizontal" Grid.Row="2" Margin="4" HorizontalAlignment="Right">
                <TextBlock Text="Final Score: " x:Uid="FinalScoreTitleTextBlock" Style="{StaticResource TitleTextStyle}" VerticalAlignment="Bottom"/>
                <TextBlock Text="{Binding FinalScore}" Style="{StaticResource SubheaderTextStyle}" Margin="8,0,0,0"  VerticalAlignment="Bottom"/>
                <Path x:Name="scoreStar" Data="M232.83511,311.94046 L328.35764,141.791 L422.38788,313.43289 L608.95538,347.76135 L474.62683,488.06033 L501.49258,679.10577 L328.35773,595.52338 L153.7303,680.59827 L177.61131,488.06061 L46.267715,347.76151 z" Stretch="UniformToFill" UseLayoutRounding="False" StrokeThickness="2" StrokeStartLineCap="Round" StrokeEndLineCap="Round" StrokeDashCap="Round" StrokeLineJoin="Round" StrokeMiterLimit="0" Style="{StaticResource WinningPointsStarStyle}" Width="20" Height="20" VerticalAlignment="Bottom" />
            </StackPanel>
            <StackPanel Grid.Row="3" Visibility="{Binding ScoreSaved, Converter={StaticResource InvertedBooleanToVisibilityConverter}}" Margin="0,8,0,0">
                <TextBlock Text="Player name" x:Uid="PlayerNameTitleTextBlock" Style="{StaticResource TitleTextStyle}" />
                <TextBox Text="{Binding PlayerName, Mode=TwoWay}" Margin="0,6,4,4" />
                <Button Click="SaveScoreClick" Content="Save Score" x:Uid="SaveScoreButton" Margin="0,0,4,4" HorizontalAlignment="Stretch"/>
                <Button Click="SaveAndShareScoreClick" Content="Save and Share Score" x:Uid="SaveAndShareScoreButton" Margin="0,0,4,4" HorizontalAlignment="Stretch"/>
            </StackPanel>
            <StackPanel Grid.Row="3" Visibility="{Binding ScoreSaved, Converter={StaticResource BooleanToVisibilityConverter}}" Margin="0,8,0,0">
                <Button Click="ShareScoreClick" Content="Share Score" x:Uid="ShareScoreButton" Margin="0,0,4,4" HorizontalAlignment="Stretch"/>
            </StackPanel>
        </Grid>
        <VisualStateManager.VisualStateGroups>

            <!-- Visual states reflect the application's view state -->
            <VisualStateGroup x:Name="ApplicationViewStates">
                <VisualState x:Name="FullScreenLandscape"/>
                <VisualState x:Name="Filled"/>

                <!-- The back button respects the narrower 100-pixel margin convention for portrait -->
                <VisualState x:Name="FullScreenPortrait">
                    <Storyboard>
                    </Storyboard>
                </VisualState>

                <!-- The back button and title have different styles when snapped -->
                <VisualState x:Name="Snapped">
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="resultListHeaderGrid" Storyboard.TargetProperty="Style">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ResultsListGridStyleSnapped}"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="questionListHeader" Storyboard.TargetProperty="Style">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ResultsListHeaderTextStyleSnapped}"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="correctAnswerListHeader" Storyboard.TargetProperty="Style">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ResultsListHeaderTextStyleSnapped}"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="selectedAnswerListHeader" Storyboard.TargetProperty="Style">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ResultsListHeaderTextStyleSnapped}"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="pointsListHeader" Storyboard.TargetProperty="Style">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ResultsListHeaderTextStyleSnapped}"/>
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
    </Grid>
</common:LayoutAwarePage>